<template>
    <el-breadcrumb separator-class="el-icon-arrow-right">
        <el-breadcrumb-item :to="{ path: '/' }">首页</el-breadcrumb-item>
        <el-breadcrumb-item>创建商品</el-breadcrumb-item>
        <router-link to="/shop/goods/list">
            <el-button style=" margin-top: -8px;">回到商品列表</el-button>
        </router-link>
    </el-breadcrumb>
    <el-form ref="form" :model="form" label-width="100px">
        <el-form-item label="商品名称">
            <el-input v-model="form.title"></el-input>
        </el-form-item>
        <el-form-item label="封面">
            <el-input v-model="form.cover"></el-input>
        </el-form-item>
        <el-form-item label="商品分类">
            <el-select v-model="form.category_id" placeholder="选择商品分类">
                <el-option v-for="(item, index) in this.createList1" :key="index" :label="item.name"
                    :value="item.id"></el-option>
            </el-select>
        </el-form-item>
        <el-form-item label="商品描述">
            <el-input type="textarea" v-model="form.desc" placeholder="选填，商品卖点简述，例如：此款商品美观大方 性价比较高 不容错过"></el-input>
        </el-form-item>
        <el-form-item label="商品单位">
            <el-input v-model="form.unit" placeholder="请输入商品单位"></el-input>
        </el-form-item>
        <el-form-item label="总库存">
            <input type="number" v-model="form.stock"><span>件</span>
        </el-form-item>
        <el-form-item label="库存预警">
            <input type="number" v-model="form.min_stock"><span>件</span>
        </el-form-item>
        <el-form-item label="最低销售价">
            <input type="number" v-model="form.min_price"><span>元</span>
        </el-form-item>
        <el-form-item label="最低原价">
            <input type="number" v-model="form.min_oprice"><span>件</span>
        </el-form-item>
        <el-form-item label="库存显示">
            <el-radio-group v-model="form.stock_display">
                <template v-slot="scope">
                    <el-radio label="是"></el-radio>
                    <el-radio label="否"> </el-radio>
                </template>
            </el-radio-group>
        </el-form-item>
        <el-form-item label="是否上架">
            <el-radio-group v-model="form.ischeck">
                <el-radio label="放入仓库"></el-radio>
                <el-radio label="立即上架"></el-radio>
            </el-radio-group>
        </el-form-item>
        <el-form-item label="运营模板">
            <el-select v-model="form.express_id" placeholder="请选择运费模板">
                <el-option v-for="(item, index) in this.createList2" :key="index" :label="item.name"
                    :value="item.id"></el-option>
            </el-select>
        </el-form-item>
    </el-form>
    <el-button type="primary" style="width: 100px;" @click="onSubmit()">提交</el-button>
</template>

<script>
import { api_goodsCreate } from '@/common/api/index'
export default {
    data() {
        return {
            form: {
                category_id: "",
                cover: "",
                desc: "",
                express_id: "",
                ischeck: 0,
                min_oprice: "",
                min_price: "",
                min_stock: "",
                // status: '',
                stock: "",
                stock_display: 0,
                title: "",
                unit: ""
            },
            createList1: [],
            createList2: []
        }
    },
    methods: {
        async onSubmit() {
            // if(this.form.ischeck== '放入仓库' ){
            //     this.form.ischeck=0
            // }else{
            //     this.form.ischeck=1
            // }
            // if(this.form.stock_display== '是' ){
            //     this.form.stock_display=1
            // }else{
            //     this.form.stock_display=0
            // }
            // var res = await api_goodsCreate({
            //     category_id: 2,
            //     cover: "",
            //     desc: "啊啊啊啊啊啊啊",
            //     express_id: 3,
            //     ischeck: 0,
            //     min_oprice: "1",
            //     min_price: "1",
            //     min_stock: "1",
            //     status: 0,
            //     stock: "1",
            //     stock_display: 1,
            //     title: "啊啊",
            //     unit: "啊啊啊啊"
            // })

            this.$axios.post('http://ceshi5.dishait.cn/admin/goods',{
                category_id: 2,
                cover: "",
                desc: "啊啊啊啊啊啊啊",
                express_id: 3,
                ischeck: 0,
                min_oprice: "1",
                min_price: "1",
                min_stock: "1",
                status: 0,
                stock: "1",
                stock_display: 1,
                title: "啊啊",
                unit: "啊啊啊啊"
            }).then(res=>{
                console.log(res);
            })

            console.log(this.form);

            console.log('submit!');
        },
    },
    mounted() {
        // // 发布商品 
        // this.$axios.get(`http://ceshi5.dishait.cn/admin/goods_type/1?limit=10`,{
        //     headers:{'token':this.$store.state.user.token}
        // }).then(res=>{
        //     console.log(res);
        // })

        // 获取 商品分类 和 运费模板
        this.$axios.get(`http://ceshi5.dishait.cn/admin/goods/create`, {
            headers: { 'token': this.$store.state.user.token }
        }).then(res => {
            if (res.data.msg == 'ok') {
                this.createList1 = res.data.data.cates
                this.createList2 = res.data.data.express.list
            }
        })
    }
}
</script>

<style scoped>
.el-breadcrumb {
    border-bottom: 1px solid #dee2e6;
    padding-bottom: 20px;
    margin-bottom: 20px;
}

.el-form-item {
    max-width: 560px;
}
</style>